import React from 'react';
// also exported from '@storybook/react' if you can deal with breaking changes in 6.1
import { Story, Meta } from '@storybook/react/types-6-0';

import {  Button, ButtonProps } from './button';

export default {
  title: 'Example/button',
  component: Button,
  argTypes: {
    backgroundColor: { control: 'color' },
  },
} as Meta;

const Template: Story<ButtonProps> = (args) => <Button {...args} style={{ marginLeft: '2em' }}/>;

export const Primary = Template.bind({});
Primary.args = {
  btnType: 'primary',
  children: 'Button',
};

export const Danger = Template.bind({});
Danger.args = {
  btnType: 'danger',
  children: 'Button',
};

export const Default = Template.bind({});
Default.args = {
  btnType: 'default',
  children: 'Button'
}

export const Link = Template.bind({});
Link.args = {
  btnType: 'link',
  href: 'http://baidu.com',
  children: 'Button',
};

export const Large = Template.bind({});
Large.args = {
  size: 'lg',
  children: 'Button',
};

export const Small = Template.bind({});
Small.args = {
  children: 'Button',
};